<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<!--      <el-form-item label="产业集群" prop="parkIndustry">
        <el-select v-model="queryParams.parkIndustry"  placeholder="请选择产业集群" clearable>
          <el-option
            v-for="dict in dict.type.industry_orientation"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>-->
      <el-form-item label="所属城市" prop="cityId">
        <el-select v-model="queryParams.provinceId" placeholder="请选择省份" style="width: 120px"
                   @change="getCityList(queryParams.provinceId)" clearable>
          <el-option
            v-for="dict in provinces"
            :key="dict.id"
            :label="dict.name"
            :value="dict.id"
          />
        </el-select>
        <el-select v-model="queryParams.cityId" placeholder="请选择城市" style="width: 120px"
                   :disabled="queryParams.provinceId==null||queryParams.provinceId===''"
                   @change="getAreaList(queryParams.cityId)" clearable >
          <el-option
            v-for="dict in citys"
            :key="dict.id"
            :label="dict.name"
            :value="dict.id"
          />
        </el-select>
        <el-select v-model="queryParams.areaId" placeholder="请选择区域" style="width: 120px"
                   :disabled="queryParams.cityId==null||queryParams.cityId===''" clearable >
          <el-option
            v-for="dict in areas"
            :key="dict.id"
            :label="dict.name"
            :value="dict.id"
          />
        </el-select>
      </el-form-item>
<!--      <el-form-item label="园区类型" prop="parkType">
        <el-select v-model="queryParams.parkType" placeholder="请选择园区类型" clearable>
          <el-option
            v-for="dict in dict.type.park_type"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="土地名称" prop="landName">
        <el-input
          v-model="queryParams.landName"
          placeholder="请输入土地名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="经济带" prop="landEconomic">
        <el-select v-model="queryParams.landEconomic" placeholder="请选择经济带" clearable>
          <el-option
            v-for="dict in dict.type.economic_belt"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="空置土地位置" prop="landAddress">
        <el-input
          v-model="queryParams.landAddress"
          placeholder="请输入空置土地位置"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>-->
      <el-form-item label="土地类别" prop="landType" >
        <el-select v-model="queryParams.landType" placeholder="请选择土地类别" clearable>
          <el-option
            v-for="dict in dict.type.land_type"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
<!--      <el-form-item label="总面积" prop="landAllSize">
        <el-input
          v-model="queryParams.landAllSize"
          placeholder="请输入总面积"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="空置面积" prop="landFressSize">
        <el-input
          v-model="queryParams.landFressSize"
          placeholder="请输入空置面积"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>-->
      <el-form-item label="土地权属" prop="landTypeOwner" >
        <el-select v-model="queryParams.landTypeOwner" placeholder="请选择土地权属" clearable>
          <el-option
            v-for="dict in dict.type.land_ownership"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
<!--      <el-form-item label="土地级别" prop="landLevel">
        <el-input
          v-model="queryParams.landLevel"
          placeholder="请输入土地级别"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="土地整理情况" prop="landArrange">
        <el-select v-model="queryParams.landArrange" placeholder="请选择土地整理情况" clearable>
          <el-option
            v-for="dict in dict.type.land_consolidation"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="容积率" prop="landPlotRatio">
        <el-input
          v-model="queryParams.landPlotRatio"
          placeholder="请输入容积率"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="建筑密度" prop="landBuildDensity">
        <el-input
          v-model="queryParams.landBuildDensity"
          placeholder="请输入建筑密度"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="绿化率" prop="landGreenRate">
        <el-input
          v-model="queryParams.landGreenRate"
          placeholder="请输入绿化率"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>-->
      <el-form-item label="出让方式" prop="landSell" style="width: 510px">
        <el-select v-model="queryParams.landSell" placeholder="请选择土地出让方式" clearable>
          <el-option
            v-for="dict in dict.type.land_grant"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="土地价格" prop="landPrice" >
        <el-input
          v-model="queryParams.landPrice"
          placeholder="请输入土地价格"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
<!--      <el-form-item label="园区ID" prop="parkId">
        <el-input
          v-model="queryParams.parkId"
          placeholder="请输入园区ID"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="所属城市ID" prop="cityId">
        <el-input
          v-model="queryParams.cityId"
          placeholder="请输入所属城市ID"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="浏览量" prop="pageView">
        <el-input
          v-model="queryParams.pageView"
          placeholder="请输入浏览量"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="是否收藏0否1是" prop="collectState">
        <el-input
          v-model="queryParams.collectState"
          placeholder="请输入是否收藏0否1是"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="是否明星推荐0否1是" prop="recState">
        <el-input
          v-model="queryParams.recState"
          placeholder="请输入是否明星推荐0否1是"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="预定状态0未预定1已预定" prop="reserveState">
        <el-input
          v-model="queryParams.reserveState"
          placeholder="请输入预定状态0未预定1已预定"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="明星推荐状态0否1是" prop="recomState">
        <el-input
          v-model="queryParams.recomState"
          placeholder="请输入明星推荐状态0否1是"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="联系人" prop="contactName">
        <el-input
          v-model="queryParams.contactName"
          placeholder="请输入联系人"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="联系方式" prop="servicePhone">
        <el-input
          v-model="queryParams.servicePhone"
          placeholder="请输入联系方式"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="联系方式" prop="contactPhone">
        <el-input
          v-model="queryParams.contactPhone"
          placeholder="请输入联系方式"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="发布人用户ID" prop="supplyUserId">
        <el-input
          v-model="queryParams.supplyUserId"
          placeholder="请输入发布人用户ID"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="审核状态：0待审核1审核通过2审核失败" prop="approvalState">
        <el-input
          v-model="queryParams.approvalState"
          placeholder="请输入审核状态：0待审核1审核通过2审核失败"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="审核备注" prop="approvalNote">
        <el-input
          v-model="queryParams.approvalNote"
          placeholder="请输入审核备注"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="备注" prop="note">
        <el-input
          v-model="queryParams.note"
          placeholder="请输入备注"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="排序" prop="sort">
        <el-input
          v-model="queryParams.sort"
          placeholder="请输入排序"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="状态0有效1失效" prop="state">
        <el-input
          v-model="queryParams.state"
          placeholder="请输入状态0有效1失效"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="是否删除0否1是" prop="dr">
        <el-input
          v-model="queryParams.dr"
          placeholder="请输入是否删除0否1是"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="是否置顶0：否1：是" prop="top">
        <el-select v-model="queryParams.top" placeholder="请选择是否置顶0：否1：是" clearable>
          <el-option
            v-for="dict in dict.type.sys_yes_no"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>-->
      <el-form-item label="审核状态" prop="approvalState">
        <el-select v-model="queryParams.approvalState" placeholder="请选择审核状态" clearable>
          <el-option
            v-for="dict in dict.type.audit_status"
            :key="dict.value"
            :label="dict.label"
            :value="dict.value"
          />
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['myIndustry:land:add']"
        >新增</el-button>
      </el-col>
<!--      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['myIndustry:land:edit']"
        >修改</el-button>
      </el-col>-->
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['myIndustry:land:remove']"
        >删除</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['myIndustry:land:export']"
        >导出</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="landList" @selection-change="handleSelectionChange" height="410" fixed>
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="序号" align="center" prop="id" />
      <el-table-column label="土地名称" align="center" prop="landName" />
<!--      <el-table-column label="经济带" align="center" prop="landEconomic">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.economic_belt" :value="scope.row.landEconomic"/>
        </template>
      </el-table-column>-->
      <el-table-column label="所在区域" align="center" prop="landArea" />
<!--      <el-table-column label="空置土地位置" align="center" prop="landAddress" />-->
      <el-table-column label="土地类别" align="center" prop="landType">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.land_type" :value="scope.row.landType"/>
        </template>
      </el-table-column>
      <el-table-column label="租售类型" align="center" prop="landSaleType" />
      <el-table-column label="总面积" align="center" prop="landAllSize" />
      <el-table-column label="空置面积" align="center" prop="landFressSize" />
      <el-table-column label="土地权属" align="center" prop="landTypeOwner">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.land_ownership" :value="scope.row.landTypeOwner"/>
        </template>
      </el-table-column>
<!--      <el-table-column label="土地级别" align="center" prop="landLevel" />-->
      <el-table-column label="土地整理情况" align="center" prop="landArrange" width="100">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.land_consolidation" :value="scope.row.landArrange"/>
        </template>
      </el-table-column>
      <el-table-column label="关联园区" align="center" prop="parkId" />
      <el-table-column label="土地出让方式" align="center" prop="landSell" width="100">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.land_grant" :value="scope.row.landSell"/>
        </template>
      </el-table-column>
      <el-table-column label="土地价格" align="center" prop="landPrice" />
<!--      <el-table-column label="土地规划指标" align="center" prop="landPlan" />
      <el-table-column label="容积率" align="center" prop="landPlotRatio" />
      <el-table-column label="建筑密度" align="center" prop="landBuildDensity" />
      <el-table-column label="绿化率" align="center" prop="landGreenRate" />
      <el-table-column label="产业规划需求" align="center" prop="landInvestNeed" />
      <el-table-column label="扶持政策" align="center" prop="landPolic">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.policy" :value="scope.row.landPolic ? scope.row.landPolic.split(',') : []"/>
        </template>
      </el-table-column>

      <el-table-column label="园区ID" align="center" prop="parkId" />
      <el-table-column label="所属城市ID" align="center" prop="cityId" />-->
      <el-table-column label="发布类型" align="center" prop="releaseType">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.announce_type" :value="scope.row.releaseType"/>
        </template>
      </el-table-column>
      <el-table-column label="联系人" align="center" prop="contactName" />
      <el-table-column label="审核状态" align="center" prop="approvalState" >
        <template slot-scope="scope">
          <dict-tag :options="dict.type.audit_status" :value="scope.row.approvalState"/>
        </template>
      </el-table-column>
<!--      <el-table-column label="浏览量" align="center" prop="pageView" />
      <el-table-column label="是否收藏" align="center" prop="collectState">
        <template slot-scope="scope">
          {{ scope.row.collectState === 0 ? '否' : '是' }}
        </template>
      </el-table-column>
      <el-table-column label="是否明星" align="center" prop="recState">
        <template slot-scope="scope">
          {{ scope.row.recState === 0 ? '否' : '是' }}
        </template>
      </el-table-column>
      <el-table-column label="预定状态" align="center" prop="reserveState">
        <template slot-scope="scope">
          {{ scope.row.reserveState === 0 ? '未预定' : '已预定' }}
        </template>
      </el-table-column>
      <el-table-column label="VR资源" align="center" prop="vrResource" />
      <el-table-column label="明星推荐" align="center" prop="reserveState">
        <template slot-scope="scope">
          {{ scope.row.reserveState === 0 ? '否' : '是' }}
        </template>
      </el-table-column>
      <el-table-column label="图片资源" align="center" prop="imgResource" width="100">
        <template slot-scope="scope">
          <image-preview :src="scope.row.imgResource" :width="50" :height="50"/>
        </template>
      </el-table-column>
      <el-table-column label="封面资源http:p1" align="center" prop="coverResource" width="100">
        <template slot-scope="scope">
          <image-preview :src="scope.row.coverResource" :width="50" :height="50"/>
        </template>
      </el-table-column>
      <el-table-column label="联系方式" align="center" prop="servicePhone" />
      <el-table-column label="联系方式" align="center" prop="contactPhone" />
      <el-table-column label="发布人用户ID" align="center" prop="supplyUserId" />
      <el-table-column label="审核状态" align="center" prop="approvalState">
        <template slot-scope="scope">
          <span v-if="scope.row.approvalState === 0">待审核</span>
          <span v-else-if="scope.row.approvalState === 1">审核通过</span>
          <span v-else="scope.row.approvalState === 2">审核失败</span>
        </template>
      </el-table-column>
      <el-table-column label="审核意见" align="center" prop="approvalNote" />
      <el-table-column label="备注" align="center" prop="note" />
      <el-table-column label="排序" align="center" prop="sort" />
      <el-table-column label="状态" align="center" prop="state" />
      <el-table-column label="是否删除" align="center" prop="dr">
        <template slot-scope="scope">
          {{ scope.row.dr === 0 ? '否' : '是' }}
        </template>
      </el-table-column>
      <el-table-column label="VR封面" align="center" prop="vrcover" width="100">
        <template slot-scope="scope">

          <image-preview :src="scope.row.vrcover" :width="50" :height="50"/>
        </template>
      </el-table-column>
      <el-table-column label="是否置顶" align="center" prop="top">
        <template slot-scope="scope">

          <dict-tag :options="dict.type.sys_yes_no" :value="scope.row.top === 0 ? '否' : '是'"/>
        </template>
      </el-table-column>-->
      <el-table-column width="220" label="操作" align="center" class-name="small-padding fixed-width" fixed="right">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-view"
            @click="handleLook(scope.row)"
          >预览
          </el-button>
          <el-button
            style=""
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['myIndustry:land:edit']"
          >修改</el-button>
<!--          <el-col :span="13">
            <el-button
              style="color: #ffba00"
              size="mini"
              type="text"
              icon="el-icon-edit"
              v-if="scope.row.approvalState===0"
              @click="spaceAudit(scope.row)"
              v-hasPermi="['myIndustry:warehouse:edit']"
            >审核</el-button>
          </el-col>-->
          <el-button
            style=""
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['myIndustry:land:remove']"
          >删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改土地对话框 -->
    <el-dialog :title="title" :visible.sync="open" :close-on-click-modal="false" width="759px" append-to-body center>
      <el-form ref="form" :model="form" :rules="rules" label-width="130px" class="float-centered" style="margin-left: 2%; margin-right: 2%">
        <el-form-item label="土地名称" prop="landName">
          <el-input v-model="form.landName" placeholder="请输入土地名称" size="small" class="land" maxlength="50"/>
        </el-form-item>

        <el-row>
          <el-col :span="24">
            <el-form-item label="经济带" prop="landEconomic">
              <el-select v-model="form.landEconomic" placeholder="请选择经济带" class="land">
                <el-option
                  v-for="dict in dict.type.economic_belt"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
<!--          <el-col :span="24">
            <el-form-item label="发布类型" prop="releaseType">
              <el-select v-model="form.releaseType" placeholder="请选择发布类型" class="land" clearable>
                <el-option
                  v-for="dict in dict.type.announce_type"
                  :key="dict.value"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                />
              </el-select>
            </el-form-item>
          </el-col>-->
        </el-row>

        <el-row>
          <el-col :span="24">
            <el-form-item label="所在区域" prop="cityId" >
              <el-select v-model="form.provinceId" placeholder="请选择省份"
                         @change="getCityList(form.provinceId)" style="width: 30%">
                <el-option
                  v-for="dict in provinces"
                  :key="dict.id"
                  :label="dict.name"
                  :value="dict.id"
                />
              </el-select>
              <el-select v-model="form.cityId" placeholder="请选择城市" :disabled="form.provinceId==null||form.provinceId===''" @change="getAreaList(form.cityId)" style="width: 30%" >
                <el-option
                  v-for="dict in citys"
                  :key="dict.id"
                  :label="dict.name"
                  :value="dict.id"
                />
              </el-select>
              <el-select v-model="form.areaId" placeholder="请选择区域" :disabled="form.cityId==null||form.cityId===''" style="width: 30%" clearable>
                <el-option
                  v-for="dict in areas"
                  :key="dict.id"
                  :label="dict.name"
                  :value="dict.id"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="空置土地位置" prop="landAddress">
              <el-input v-model="form.landAddress" placeholder="请输入空置土地位置" class="land" maxlength="50"/>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="24">
            <el-form-item label="总面积" prop="landAllSize" style="flex: 0">
              <el-input v-model="form.landAllSize" @change="highLimit" oninput="value=value.replace(/[^0-9.]/g,'')" maxlength="50"
                        placeholder="请输入总面积" class="land">
                <template slot="append">平方公里</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="空置面积" prop="landFressSize" style="flex: 0">
              <el-input v-model="form.landFressSize" @change="highLimit" oninput="value=value.replace(/[^0-9.]/g,'')" maxlength="50"
                        placeholder="请输入空置面积" class="land">
                <template slot="append">平方公里</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item>
              <el-alert
                class="land" title="空置面积大于总面积" v-if="acreage<0" :closable="false" type="error" center show-icon>
              </el-alert>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="土地类别" prop="landType">
              <el-select v-model="form.landType" placeholder="请选择土地类别" class="land">
                <el-option
                  v-for="dict in dict.type.land_type"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="土地权属" prop="landTypeOwner">
              <el-select v-model="form.landTypeOwner" placeholder="请选择土地权属" class="land">
                <el-option
                  v-for="dict in dict.type.land_ownership"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="土地级别" prop="landLevel">
              <el-input v-model="form.landLevel" placeholder="请输入土地级别" class="land" maxlength="50"/>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="土地整理情况" prop="landArrange">
              <el-select v-model="form.landArrange" placeholder="请选择土地整理情况" class="land">
                <el-option
                  v-for="dict in dict.type.land_consolidation"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="容积率" prop="landPlotRatio">
              <el-input v-model="form.landPlotRatio" placeholder="请输入容积率" maxlength="50"
                        oninput="value=value.replace(/[^0-9.]/g,'')" @change="highLimit" class="land">
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="建筑密度" prop="landBuildDensity">
              <el-input v-model="form.landBuildDensity" placeholder="请输入建筑密度" maxlength="50"
                        oninput="value=value.replace(/[^0-9.]/g,'')" @change="highLimit" class="land">
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="绿化率" prop="landGreenRate">
              <el-input v-model="form.landGreenRate" placeholder="请输入绿化率" maxlength="50"
                        oninput="value=value.replace(/[^0-9.]/g,'')" @change="highLimit" class="land">
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="土地出让方式" prop="landSell">
              <el-select v-model="form.landSell" placeholder="请选择土地出让方式" class="land">
                <el-option
                  v-for="dict in dict.type.land_grant"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="土地价格" prop="landPrice">
              <el-radio-group v-model="form.landPrice">
                <el-radio :label="'含税-'">含税<input class="sq" style="width: 50px" oninput ="value=value.replace(/[^0-9.]/g,'')" v-model="otherPrice"/>
                  万元亩
                </el-radio>

                <el-radio :label="'不含税-'">不含税
                  <input class="sq" style="width: 50px" oninput ="value=value.replace(/[^0-9.]/g,'')" v-model="otherPrice2"/>
                  万元亩
                </el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="土地规划指标" prop="landPlan" v-if="form.releaseType===0">
          <el-input v-model="form.landPlan" type="textarea" placeholder="请输入内容" class="land" maxlength="50"/>
        </el-form-item>
        <el-form-item label="产业规划需求" prop="landInvestNeed" v-if="form.releaseType===1">
          <el-input v-model="form.landInvestNeed" type="textarea" placeholder="请输入内容" class="land" maxlength="50"/>
        </el-form-item>
        <el-form-item label="扶持政策" prop="landPolic">
          <el-checkbox-group v-model="form.landPolic">
            <el-checkbox
              v-for="dict in dict.type.policy"
              :key="dict.value"
              :label="dict.value">
              {{ dict.label }}
            </el-checkbox>
          </el-checkbox-group>
        </el-form-item>

<!--        <el-row>
          <el-col :span="24">
&lt;!&ndash;        <el-form-item label="园区ID" prop="parkId">&ndash;&gt;
&lt;!&ndash;          <el-input v-model="form.parkId" placeholder="请输入园区ID" />&ndash;&gt;
&lt;!&ndash;        </el-form-item>&ndash;&gt;

            <el-form-item label="浏览量" prop="pageView">
              <el-input v-model="form.pageView" placeholder="请输入浏览量" oninput="value=value.replace(/[^0-9]/g,'')" class="land"/>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="是否置顶" prop="top">
              <el-select v-model="form.top" placeholder="请选择是否置顶" class="land">
                <el-option
                  v-for="dict in dict.type.sys_whether"
                  :key="dict.value"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="收藏" prop="collectState">
              <el-select v-model="form.collectState" placeholder="请选择是否收藏" class="land">
                <el-option
                  v-for="dict in dict.type.sys_whether"
                  :key="dict.value"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="是否明星推荐" prop="recState">
              <el-select v-model="form.recState" placeholder="请选择是否明星推荐" class="land">
                <el-option
                  v-for="dict in dict.type.recommend"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="预定状态" prop="reserveState">
              <el-select v-model="form.reserveState" placeholder="请选择是否预定" class="land">
                <el-option
                  v-for="dict in dict.type.reserve_type"
                  :key="dict.value"
                  :label="dict.label"
                  :value="parseInt(dict.value)"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="热门推荐" prop="recomState">
              <el-select v-model="form.recomState" placeholder="请选择热门推荐状态" class="land">
                <el-option
                  v-for="dict in dict.type.recommend"
                  :key="dict.value"
                  :label="dict.label"
                  :value="dict.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>-->
        <el-form-item label="VR封面" prop="vrcover">
          <image-upload v-model="form.vrcover" :limit="1"/>
        </el-form-item>
        <el-form-item label="微信二维码" prop="qrCode">
          <image-upload v-model="form.qrCode" :limit="1"/>
        </el-form-item>
        <el-form-item label="VR资源" prop="vrResource">
          <video-upload v-model="form.vrResource"/>
        </el-form-item>
        <el-form-item label="图片资源" prop="imgResource">
          <image-upload v-model="form.imgResource"/>
        </el-form-item>
        <el-form-item label="封面资源" prop="coverResource">
          <image-upload v-model="form.coverResource" :limit="1"/>
        </el-form-item>

        <el-row>
          <el-col :span="24">
            <el-form-item label="联系人" prop="contactName">
              <el-input v-model="form.contactName" placeholder="请输入联系人" class="land" maxlength="50"/>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="联系方式" prop="contactPhone">
              <el-input v-model="form.contactPhone" placeholder="请输入联系方式" class="land" maxlength="50"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="备注" prop="note">
          <el-input v-model="form.note" type="textarea" maxlength="100" show-word-limit placeholder="请输入备注" class="land"/>
        </el-form-item>
        <el-form-item >
          <el-alert
            title="初审通过" type="success" center :closable="false" v-if="form.approvalState===1||form.approvalState===3||form.approvalState===4" class="land" show-icon>
          </el-alert>
          <el-alert
            title="初审拒绝" type="error" center :closable="false" v-if="form.approvalState===2" class="land" show-icon>
          </el-alert>
        </el-form-item>
        <el-form-item label="初审意见" prop="approvalNote" v-if="form.approvalState!==0&&form.approvalState!=null">
          <editor v-model="form.approvalNote" :min-height="100" class="land" read-only/>
        </el-form-item>
        <el-form-item>
          <el-alert title="复审通过" type="success" center :closable="false" v-if="form.approvalState===1" class="land" show-icon>
          </el-alert>
          <el-alert title="复审拒绝" type="error" center :closable="false" v-if="form.approvalState===4" class="land" show-icon>
          </el-alert>
        </el-form-item>
        <el-form-item label="复审意见" prop="recheckNote" v-if="form.approvalState===1||form.approvalState===4">
          <editor v-model="form.recheckNote" :min-height="100" class="land" read-only/>
        </el-form-item>
<!--        <el-form-item label="发布人用户ID" prop="supplyUserId">
          <el-input v-model="form.supplyUserId" placeholder="请输入发布人用户ID" />
        </el-form-item>
        <el-form-item label="审核状态" prop="approvalState">
          <el-select v-model="form.approvalState" placeholder="请选择审核状态">
            <el-option
              v-for="dict in dict.type.audit_status"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="联系方式" prop="servicePhone">
          <el-input v-model="form.servicePhone" placeholder="请输入联系方式" />
        </el-form-item>
        <el-form-item label="审核意见" prop="approvalNote">
          <el-input v-model="form.approvalNote" placeholder="请输入审核意见" />
        </el-form-item>
        <el-form-item label="排序" prop="sort">
          <el-input v-model="form.sort" placeholder="请输入排序" />
        </el-form-item>
        <el-form-item label="状态" prop="state">
          <el-select v-model="form.state" placeholder="请选择是否生效">
            <el-option
              v-for="dict in dict.type.sys_yes_no"
              :key="dict.value"
              :label="dict.label"
              :value="dict.label === '是' ? 1 : 0"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="是否删除" prop="dr">
          <el-select v-model="form.dr" placeholder="请选择是否删除">
            <el-option
              v-for="dict in dict.type.sys_yes_no"
              :key="dict.value"
              :label="dict.label"
              :value="dict.label === '是' ? 1 : 0"
            ></el-option>
          </el-select>
        </el-form-item>-->

      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
    <!-- 审核 -->
    <el-dialog title="土地审核" :visible.sync="LandAudit" close-on-click-modal center width="750px">
      <el-form :model="form" label-width="130px" >
        <el-form-item label="审核意见" prop="approvalNote">
          <Editor v-model="form.approvalNote" :min-height="100" style="width: 490px"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="success" @click="submitCheck(1)">审核通过</el-button>
        <span style="width: 5%;display: inline-block"></span>
        <el-button type="danger" @click="submitCheck(2)">审核驳回</el-button>
        <span style="width: 5%;display: inline-block"></span>
        <el-button type="info" @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { listLand, getLand, delLand, addLand, updateLand } from "@/api/myIndustry/land";
import {listCity} from "@/api/business/businessIntro";
import VideoUpload from "@/components/VideoUpload";
import MyEditor from "@/components/wangEdiot";

export default {
  name: "Land",
  components: {MyEditor, VideoUpload},
  dicts: ['sys_yes_no', 'land_type','sys_whether','recommend','reserve_type', 'announce_type','audit_status','park_type', 'policy','industry_orientation', 'land_ownership', 'economic_belt', 'land_grant', 'land_consolidation'],
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      //省份
      provinces: [],
      //城市
      citys: [],
      //区域
      areas: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 土地表格数据
      landList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      LandAudit: false,
      //土地价格
      otherPrice:null,
      otherPrice2:null,
      acreage: 0,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        landName: null,
        parkIndustry:null,
        landEconomic: null,
        landArea: null,
        landAddress: null,
        landType: null,
        landAllSize: null,
        landFressSize: null,
        landTypeOwner: null,
        landLevel: null,
        landArrange: null,
        landPlan: null,
        landPlotRatio: null,
        landBuildDensity: null,
        landGreenRate: null,
        landSell: null,
        landPrice: null,
        landInvestNeed: null,
        landPolic: null,
        landSaleType: null,
        parkId: null,
        provinceId: null,
        cityId: null,
        areaId: null,
        releaseType: 0,
        pageView: null,
        collectState: null,
        recState: null,
        reserveState: null,
        vrResource: null,
        recomState: null,
        imgResource: null,
        coverResource: null,
        contactName: null,
        servicePhone: null,
        contactPhone: null,
        supplyUserId: null,
        approvalState: null,
        approvalNote: null,
        note: null,
        sort: null,
        state: null,
        dr: null,
        vrcover: null,
        top: null
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        landName: [
          { required: true, message: "土地名称不能为空", trigger: "blur" }
        ],
        landEconomic: [
          { required: true, message: "经济带不能为空", trigger: "change" }
        ],
        landArea: [
          { required: true, message: "区域不能为空", trigger: "change" }
        ],
        releaseType: [
          { required: true, message: "发布类型不能为空", trigger: "blur" }
        ],
        contactName: [
          {required: true, message: "联系人不能为空", trigger: "blur"}
        ],
        contactPhone: [
          {required: true, message: "联系方式不能为空", trigger: "blur"},
          {
            required: true,
            pattern: /^[1][3,4,5,7,8,9][0-9]{9}$/,
            message: '请输入正确的手机号码',
            trigger: 'blur',
          },
        ],
        coverResource: [
          {required: true, message: "封面资源不能为空", trigger: "blur"}
        ],
        imgResource: [
          {required: true, message: "图片资源不能为空", trigger: "blur"}
        ],
        cityId: [
          {required: true, message: "所属城市不能为空", trigger: "blur"}
        ],
        landAddress: [
          {required: true, message: "空置土地位置不能为空", trigger: "blur"}
        ],
        landAllSize: [
          {required: true, message: "建筑总面积不能为空", trigger: "blur"}
        ],
        landType: [
          {required: true, message: "土地类别不能为空", trigger: "blur"}
        ],
        landTypeOwner: [
          {required: true, message: "土地权属不能为空", trigger: "blur"}
        ],
        landSell: [
          {required: true, message: "土地出让方式不能为空", trigger: "blur"}
        ],
        landPlan: [
          {required: true, message: "土地规划指标不能为空", trigger: "blur"}
        ],
        landPolic: [
          {required: true, message: "扶持政策不能为空", trigger: "blur"}
        ],
      }
    };
  },
  created() {
    this.getList();
    this.getprovinceList();
  },
  methods: {
    handleLook(row) {
      //http://120.46.220.152/#/pages/index/details?id=339&buildType=4&spaceId=dc46adbfb2944da39078f61446cd662f&provinceId=34
      // window.location.href=`http://120.46.220.152/#/pages/news/details?id=`+id
      open(`http://120.46.220.152/#/pages/index/details?id=`+row.id+`&buildType=8&spaceId=` + row.serialNumber + `&provinceId=` + row.provinceId)
    },
    highLimit() {
      if (this.form.landPlotRatio>100){
        this.form.landPlotRatio = 100
      }
      if (this.form.landBuildDensity>100){
        this.form.landBuildDensity = 100
      }
      if (this.form.landGreenRate>100){
        this.form.landGreenRate = 100
      }
      if (this.form.landAllSize!=null&&this.form.landFressSize!=null){
        this.acreage = this.form.landAllSize-this.form.landFressSize
      }
    },
    /** 查询土地列表 */
    getList() {
      this.loading = true;
      listLand(this.queryParams).then(response => {
        this.landList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.LandAudit = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.otherPrice = null;
      this.otherPrice2 = null;
      this.form = {
        id: null,
        landName: null,
        landEconomic: null,
        landArea: null,
        landAddress: null,
        landType: null,
        landAllSize: null,
        landFressSize: null,
        landTypeOwner: null,
        landLevel: null,
        landArrange: null,
        landPlan: null,
        landPlotRatio: null,
        landBuildDensity: null,
        landGreenRate: null,
        landSell: null,
        landPrice: null,
        landInvestNeed: null,
        landPolic: [],
        landSaleType: null,
        parkId: null,
        provinceId: null,
        cityId: null,
        areaId: null,
        releaseType: 0,
        pageView: null,
        collectState: null,
        recState: null,
        reserveState: null,
        vrResource: null,
        recomState: null,
        imgResource: null,
        coverResource: null,
        contactName: null,
        servicePhone: null,
        contactPhone: null,
        supplyUserId: null,
        approvalState: null,
        approvalNote: null,
        note: null,
        sort: null,
        state: null,
        dr: null,
        createTime: null,
        updateTime: null,
        vrcover: null,
        top: null
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length!==1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      if (this.$store.getters.checkState==='0'){
        this.$message({
          type: 'info',
          message: `用户信息审核中`
        });
        return
      }else if (this.$store.getters.checkState==='2'){
        this.$message({
          type: 'error',
          message: `用户信息审核失败`
        });
        return
      }else if (this.$store.getters.checkState=== '-1'){
        this.$message({
          type: 'info',
          message: `用户信息未提交`
        });
        return
      }
      this.reset();
      this.open = true;
      this.title = "添加土地";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const id = row.id || this.ids
      getLand(id).then(response => {
        this.form = response.data;
        this.form.landPolic = this.form.landPolic.split(",");
        if(response.data.landPrice!=null&&response.data.landPrice.includes("不含税-")){
          this.otherPrice2=response.data.landPrice
          this.form.landPrice=this.form.landPrice.substring(0,response.data.landPrice.indexOf("不含税-")+4);
          this.otherPrice2=this.otherPrice2.substring(this.otherPrice2.indexOf("不含税-")+4);
        }else if (response.data.landPrice!=null&&response.data.landPrice.includes("含税-")){
          this.otherPrice=response.data.landPrice
          this.form.landPrice=this.form.landPrice.substring(0,response.data.landPrice.indexOf("含税-")+3);
          this.otherPrice=this.otherPrice.substring(this.otherPrice.indexOf("含税-")+3);
        }
        if (this.form.provinceId!=null){
          listCity(this.form.provinceId).then(res =>{
            this.citys = res.data;
          })
        }
        if (this.form.cityId!=null){
          listCity(this.form.cityId).then(res =>{
            this.areas = res.data;
          })
        }
        this.open = true;
        this.title = "修改土地";
      });
    },
    /** 审核 */
    spaceAudit(row){
      this.reset();
      this.form.id = row.id
      this.LandAudit = true;
    },
    /** 提交审核 */
    submitCheck(state) {
      updateLand({
        id: this.form.id,
        approvalState: state,
        approvalNote: this.form.approvalNote
      }).then(response => {
        this.$modal.msgSuccess("审核成功");
        this.LandAudit = false;
        this.getList();
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.landPrice==="含税-"){
            if (this.otherPrice==null||this.otherPrice===''){
              this.$modal.msgError("请填写含税土地价格");
              return
            }
            this.form.landPrice=this.form.landPrice+this.otherPrice
          }else if (this.form.landPrice==="不含税-"){
            if (this.otherPrice2==null||this.otherPrice2===''){
              this.$modal.msgError("请填写不含税土地价格");
              return
            }
            this.form.landPrice=this.form.landPrice+this.otherPrice2
          }
          this.form.landPolic = this.form.landPolic.join(",");
          // this.form.approvalState = 0
          if (this.form.id != null) {
            updateLand(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addLand(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids;
      this.$modal.confirm('是否确认删除土地编号为"' + ids + '"的数据项？').then(function() {
        return delLand(ids);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {});
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download('industry/frontend/land/export', {
        ...this.queryParams
      }, `land_${new Date().getTime()}.xlsx`)
    },
    //获取省份
    getprovinceList(){
      var parentId = 0;
      listCity(parentId).then(res =>{
        // console.log("AAA",res)
        this.provinces = res.data;
      })
    },
    //查询市列表
    getCityList(provinceId) {
      listCity(provinceId).then(res =>{
        this.citys = res.data;
      })
      this.queryParams.cityId=null;
      this.queryParams.areaId=null;
      this.form.cityId = null;
      this.form.areaId = null;
    },
    //查询区列表
    getAreaList(city) {
      listCity(city).then(res =>{
        this.areas = res.data;
      })
      this.form.areaId = null;
      this.queryParams.areaId=null;
    }
  }
};
</script>
<style>
.land{
  width: 90%;
}
.sq {
  width: 25px;
  margin: 0 10px;
  border: none;
  border-bottom: 1px solid;
}
/*.float-centered{
  display: flex;
  justify-content: stretch;
  flex-wrap: wrap;
  margin-left: 253px;
}
.el-form-item {
  margin-top: 20px;
}
.pagination-container[data-v-72233bcd] {
  display: flex;
  justify-content: center;
}
.el-form-item {
  width: 600px;
}
.el-input__inner{
  width: 250px;
}*/
</style>
